<template>
  <div class="employ-container">
    <el-row>
      <el-breadcrumb separator="/">
        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item><a href="/">基础信息管理</a></el-breadcrumb-item>
        <el-breadcrumb-item>员工信息</el-breadcrumb-item>
      </el-breadcrumb>
    </el-row>
    <h1></h1>
    <el-row>
      <el-form >
        <el-row>
          <el-col :span="8">
            <el-form-item label="用户姓名" label-width="80px">
              <el-input ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item >
              <el-button type="success">搜索</el-button>
            </el-form-item>
          </el-col>
        </el-row>


      </el-form>
    </el-row>


    <el-table
      :data="tableData"
      stripe
      style="width: 100%">
      <el-table-column
        prop="name"
        label="姓名"
        width="180">
      </el-table-column>
      <el-table-column
        prop="data"
        label="职位"
        width="180">
      </el-table-column>
      <el-table-column
        prop="phone"
        label="电话"
        width="180">
      </el-table-column>
      <el-table-column
        prop="address"
        label="地址">
      </el-table-column>
    </el-table>
    <el-row>
      <el-pagination
        small
        layout="prev,pager,next":total="50">

      </el-pagination>
    </el-row>
  </div>

</template>

<script>
    export default {
        name: "User",
      data() {
        return {
          tableDate:[]
        }

      },
      mounted(){
        var_this=this;
        this.axios({
          url:'http://localhost:3000/user/list',
          method:'get'
        }).then(function(res){
          _this.tableData=res.data;
        })
      },
      data() {
        return {
          tableData: [{
            data:'后台管理员',
            phone:'1234456',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1518 弄'
          }, {
            data:'后台维护员',
            phone:'1234456',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1519 弄'
          }, {
            data:'前端管理员',
            phone:'1234456',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1516 弄'
          }, {
            data:'前端维护员',
            phone:'1234456',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1516 弄'
          }]
        }
      }
    }
</script>

<style scoped>

</style>
